/**
 * @author toplabs
 * 添加满屏雪花飘落
 */
(() => {
    window.requestAnimationFrame = window.requestAnimationFrame || window.webkitRequestAnimationFrame || function (callback) {
        window.setTimeout(callback, 1000 / 60)
    }
})();

(() => {
    const flakes = [];
    const canvas = document.getElementById('toplabs-Snow');
    const ctx = canvas.getContext('2d');
    const flakeCount = 66;
    let mX = -100;
    let mY = -100;
    canvas.width = window.innerWidth;
    canvas.height = window.innerHeight;
    canvas.style.position = 'fixed';
    canvas.style.top = '0';
    canvas.style.left = '0';
    canvas.style.width = '100%';
    canvas.style.height = '100%';
    canvas.style.zIndex = '99999';
    canvas.style.pointerEvents = 'none';
    function snow () {
        ctx.clearRect(0, 0, canvas.width, canvas.height);
        for (let i = 0; i < flakeCount; i++) {
            const flake = flakes[i];
            const x = mX;
            const y = mY;
            const minDist = 150;
            const x2 = flake.x;
            const y2 = flake.y;
            const dist = Math.sqrt((x2 - x) * (x2 - x) + (y2 - y) * (y2 - y));
            if (dist < minDist) {
                const force = minDist / (dist * dist);
                const xComp = (x - x2) / dist;
                const yComp = (y - y2) / dist;
                const deltaV = force / 2;
                flake.velX -= deltaV * xComp;
                flake.velY -= deltaV * yComp;
            } else {
                flake.velX *= 0.98;
                if (flake.velY <= flake.speed) {
                    flake.velY = flake.speed
                }
                flake.velX += Math.cos(flake.step += 0.05) * flake.stepSize
            }
            ctx.fillStyle = `rgba(255, 255, 255, ${flake.opacity})`;
            flake.y += flake.velY;
            flake.x += flake.velX;
            if (flake.y >= canvas.height || flake.y <= 0) {
                reset(flake)
            }
            if (flake.x >= canvas.width || flake.x <= 0) {
                reset(flake)
            }
            ctx.beginPath();
            ctx.arc(flake.x, flake.y, flake.size, 0, Math.PI * 2);
            ctx.fill()
        }
        requestAnimationFrame(snow)
    }

    function reset (flake) {
        flake.x = Math.floor(Math.random() * canvas.width);
        flake.y = 0;
        flake.size = (Math.random() * 3) + 2;
        flake.speed = Math.random() + 0.2;
        flake.velY = flake.speed;
        flake.velX = 0;
        flake.opacity = (Math.random() * 0.5) + 0.3
    }

    function init () {
        for (let i = 0; i < flakeCount; i++) {
            const x = Math.floor(Math.random() * canvas.width);
            const y = Math.floor(Math.random() * canvas.height);
            const size = (Math.random() * 3) + 2;
            const speed = Math.random() + 0.2;
            const opacity = (Math.random() * 0.5) + 0.3;
            flakes.push({ speed: speed, velY: speed, velX: 0, x: x, y: y, size: size, stepSize: (Math.random()) / 30, step: 0, angle: 180, opacity: opacity })
        }
        snow()
    }

    document.addEventListener('mousemove', function (e) {
        mX = e.clientX;
        mY = e.clientY;
    });
    window.addEventListener('resize', function () {
        canvas.width = window.innerWidth;
        canvas.height = window.innerHeight
    });
    init()
})();
